@extends('edu::layouts.front')

@section('content')

    <div id="app">
        {{--    视频播放器--}}
        <div class="video mb-2">
            <div class="container p-0 pl-md-3 pr-md-3">
                <div class="video">
                    <video src="" controls="">
                        <source src="{{$video->path}}"/>
                    </video>
                </div>
            </div>
        </div>
        {{--    视频播放结束--}}
        {{--    课程描述--}}
        <div class="container">
            <div class="card">
                <div class="card-body row">
                    <div class="col-12 col-md-7">
                        <h5 class="text-secondary">{{$video->title}}</h5>
                        <a
                            href="{{route('edu.front.lesson.show',$video->lesson)}}"
                            class="text-secondary font-weight-light"><i
                                aria-hidden="true" class="fa fa-folder-o"></i>
                            {{$video->lesson->title}}
                        </a></div>
                    <div class="col-12 col-md-5 mt-2 mt-md-0 d-flex justify-content-md-end justify-content-start flex-wrap">
                        <div class="btn-group btn-group-sm align-items-center mr-1">
                            @if($video->pre)
                                <a href="{{route('edu.front.video.show',$video->pre)}}" class="btn btn-outline-success">上集</a>
                            @endif
                            @if($video->next)
                                <a href="{{route('edu.front.video.show',$video->next)}}" class="btn btn-outline-success">下集</a>
                            @endif
                        </div>
                        <div class="btn-group btn-group-sm align-items-center">

                            <favorite
                                btn-class="btn btn-outline-secondary" desc-class="btn btn-outline-secondary"
                                checked-btn-class="btn btn-info" checked-desc-class="btn btn-info"
                                action="{{route('common.favorite',['Video',$video['id']])}}"
                            >
                                <template v-slot:title>
                                    收藏
                                </template>

                            </favorite>
                            <favorite
                                btn-class="btn btn-outline-info" desc-class="btn btn-outline-info"
                                checked-btn-class="btn btn-info" checked-desc-class="btn btn-info"
                                action="{{route('common.favour',['Video',$video['id']])}}"
                            >
                                <template v-slot:Title>
                                    点赞
                                </template>
                            </favorite>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {{--    课程描述结束--}}

        <div class="container mb-5 mt-3">
            <div class="row">
                <div class="col-md-9 mt-2 mt-md-0 order-md-0 mb-3">
                    {{--            用户评论--}}
                    <div class="comment" >

                        <comment error="@error('content'){{$message}} @enderror" model="Video"
                                 :id="{{$video['id']}}"></comment>
                        {{--            用户评论结束--}}
                        {{--    评论编辑器--}}


                        {{--评论编辑器结束--}}
                        <div class="el-backtop" style="right: 40px; bottom: 40px;">
                            <i class="el-icon-caret-top"></i>
                        </div>
                    </div>
                </div>
                {{--            课程列表--}}
                <div class="col-md-3 pl-md-0 order-0 order-md-1">
                    <div class="card text-secondary">
                        <div class="card-header bg-white">课程列表</div>
                        <div class="list-group list-group-flush">
                            @foreach($video->lesson->videos as $video)
                                <a href="{{route('edu.front.video.show',$video)}}"
                                   class="list-group-item text-secondary overflow-dot">{{$video->title}}</a>
                            @endforeach
                        </div>
                    </div>
                </div>
                {{--    课程列表结束--}}

            </div>


        </div>
    </div>

@endsection
